<template>
	<view class="hetong-box">
		<view class="hetong">
			<view class="title">
				合同申请
			</view>
			<view class="row">
				<view class="left">
					产品名称
				</view>
				<input type="text" value="" v-model="proName" placeholder="产品名称" />

			</view>
			<view class="row" v-show="isjinghzi>0">
				<view class="left">
					收益级别
				</view>
				<input type="text" value="" v-model="profitclass" placeholder="请输入收益级别" />
			</view>
			<view class="row">
				<view class="left">
					合同编号
				</view>
				<input type="text" value="" placeholder="请输入合同编号" />


			</view>
			<view class="row">
				<view class="left">
					合同金额
				</view>
				<input type="text" value="" v-model="balance" placeholder="请填写预约金额" />


			</view>
			<view class="row">
				<view class="left">
					签署日期
				</view>
				<!-- <view class="right"> -->
					<!-- <timePicker></timePicker> -->
				<!-- </view> -->
				<view class="uni-list-cell-db chooseInp">
					<picker mode="date" :value="date" :start="startDate" :end="endDate" @change="bindDateChange">
						<view class="uni-input">{{date}}</view>
					</picker>
				</view>
				

			</view>
			<view class="row">
				<view class="left">
					开户账户
				</view>
				<input type="text" value="" v-model="profit_card_no" placeholder="请填写账号" />


			</view>
			<view class="row">
				<view class="left">
					利益支付开户行
				</view>
				<input type="text" value="" v-model="profit_bank_nm" placeholder="请填写开户行" />


			</view>
			<view class="row">
				<view class="left">
					开户支行
				</view>
				<input type="text" value="" v-model="profit_card_bin" placeholder="请填写支行" />
			
			</view>
			<view class="row">
				<view class="left">
					开户姓名
				</view>
				<input type="text" value="" v-model="custname" placeholder="请填写开户行" />


			</view>
			<view class="">
				<view class="left" style="padding: 40upx 0 0;">
					备注
				</view>
				<textarea class="shuoming" placeholder="请填写备注">
				</textarea>


			</view>
			<addImage @click="showImg"></addImage>
			<view class="questionBox" @click="addHeTong">
				<view class="question">
					<label class="iconfont">&#xe66a;</label>提交
				</view>
			</view>
		</view>
		
	</view>
</template>

<script>
	import timePicker from '../../../../../../components/picker/picker.vue'
	import addImage from '../../../../../API/image/image.vue';
	import global_wyx from '../../../../../../components/tool/licaishiwyx'
	import global_ from '../../../../../../components/tool/Global'
	export default {
		components: {
			addImage,
			timePicker
		},
		data() {
			const currentDate = this.getDate({
				format: true
			})
			return {
				profit:'',//收益率
				profitclass:'',//收益级别
				profit_card_no:'',//银行卡号
				profit_bank_no:'',//银行编号
				profit_bank_nm:'',//银行名称
				profit_card_bin:'',//支行
				balance:'',//预约金额
				projId:'',
				custname:'',
				proName:'',
				yuyueId:'',
				imageList:[],
				isjinghzi:'',
				token:uni.getStorageSync('token_key'),
				date:currentDate
			};
		},
		onLoad(option) {
			var projId = option.projId;
			var balance  = option.balance;
			var custid   = option.custid;
			var proName  = option.proName;
			var custname = option.custname;
			var yuyueId = option.yuyueId;
			this.balance = balance;
			this.custname = option.custname;
			this.proName = proName;
			this.custname = custname;
			this.yuyueId = yuyueId;
			this.projId = projId
			uni.request({
				url: global_wyx.api.getHeTong,
				method: 'POST',
				data: {
					custid:custid,
					proj_id:projId,
					money:balance
				},
				success: res => {
					console.info(JSON.stringify(res))
					var result = res.data.data;
// 					console.info("收益率："+result.profit);
// 					console.info("收益级别："+result.profitclass);
// 					console.info("银行卡号："+result.profit_card_no);
// 					console.info("银行编号："+result.profit_bank_no);
// 					console.info("银行名称："+result.profit_bank_nm);
// 					console.info("支行："+result.profit_card_bin);
					this.profit = result.profit;
					this.profitclass = result.profitclass;
					this.profit_card_no = result.profit_card_no;
					this.profit_bank_no = result.profit_bank_no;
					this.profit_bank_nm = result.profit_bank_nm;
					this.profit_card_bin = result.profit_card_bin;
					
					// console.info("历史交易提供客户前端选择，等前端："+result.cardmnpBoList);
					
				},
				header : {'content-type':'application/x-www-form-urlencoded'},
				fail: () => {},
				complete: () => {}
			});
			this.isJingzhi();
		},
		computed: {
			startDate() {
				return this.getDate('start');
			},
			endDate() {
				return this.getDate('end');
			}
		},
		methods: {
			isJingzhi(){
				uni.request({
					url: global_wyx.api.isJingzhi,
					method: 'POST',
					data: {
						projid:this.projId
					},
					success: res => {
						console.info(JSON.stringify(res))
						var result = res.data.data;
						this.isjinghzi = result;
						// console.info("历史交易提供客户前端选择，等前端："+result.cardmnpBoList);
						
					},
					header : {'content-type':'application/x-www-form-urlencoded'},
					fail: () => {},
					complete: () => {}
				});
			},
			showImg(e){
				console.info("所选择的图片：》》》》》》》"+e.imageList);
				this.imageList = e.imageList;
			},
			addHeTong() {
				uni.request({
					url: global_wyx.api.addHeTong,
					method: 'POST',
					header : {'content-type':'application/x-www-form-urlencoded'},
					data: {
						yuyueId:this.yuyueId,
						card_username:this.custname,
						hetongWriteDate:'2019-01-19 00:00:00',
						bank_no:this.profit_bank_no,
						card_bin:this.profit_card_bin,
						card_no:this.profit_card_no,
						proj_id:this.projId,
						balance:this.balance
					},
					success: res => {
						console.info(res.data.code+"=========");
						var code = res.data.code;
						var fileNo = res.data.data;
						var message = res.data.message;
						var imageList = this.imageList;
						var addFlag = true;
						if(code==0){
							for(var i =0;i< imageList.length;i++){
									console.info("正在上传第"+(i+1)+"张图片")
									uni.uploadFile({
										url:global_wyx.api.uploadPlImg,
										filePath:imageList[i],
										name: 'file',
										header: {
											'content-type': 'multipart/form-data'
										},
										formData:{
											yewuType:'hetong',
											// fileNamePre:"合同附件"+(i+1),
											fileNo:fileNo
										},
										success: (upres) => {
											// fileNo//附件序号
											var upresult = upres.data;
											upresult=JSON.parse(upresult);
// 												console.info(upresult)
// 												console.log("code==============================")
											var code = upresult.code;
											if(code==0){
												var filename = upresult.data.cFilename;
												var fileNamePre = upresult.data.fileNamePre;
												var filesize = upresult.data.lFilesize;
												var fileUrl = upresult.data.url;
												uni.request({
													url:global_wyx.api.addJiaoKuanAcce,
													method: 'POST',
													header: {
														'content-type': 'application/x-www-form-urlencoded'
													},
													data: {
														cFilename:imageList[i].name,
														lFilesize:filesize,
														token:this.token,
														cSubkeyid:fileNo,
														cCatalog:'TBENEFICIARYINFO_REQ',
														lStorageid:fileNamePre,
														fileUrl:fileUrl
													},
													success: res => {},
													fail: () => {
														addFlag = false;
													},
													complete: () => {}
												});
											}else{
												addFlag = false;
											}
										},
										fail: (err) =>{
											addFlag = false;
										}
									})
								
							}
							var tip = "上传成功";
							if(addFlag == false){tip=tip+",上传图片失败"}
							uni.showToast({
								title: tip,
								icon: 'success',
									success: res => {
										sleep2(500).then(() => {
											uni.navigateBack({  
												delta: 1 
											});  
										})
									},
								fail: () => {},
								complete: () => {}
							});
						}else{
							uni.showModal({
								content:message,
								showCancel:false
							});
						}
					},
					fail: () => {},
					complete: () => {}
				})
			},
			bindPickerChange: function(e) {
				//console.log('picker发送选择改变，携带值为', e.target.value)
				this.index = e.target.value
				this.oper_Id = this.array[this.index];
			},
			bindDateChange: function(e) {
				this.date = e.target.value;
				console.log("修改客户了日期------"+this.date);
			},
			getDate(type) {
				const date = new Date();
				let year = date.getFullYear();
				let month = date.getMonth() + 1;
				let day = date.getDate();
			
				if (type === 'start') {
					year = year - 60;
				} else if (type === 'end') {
					year = year + 2;
				}
				month = month > 9 ? month : '0' + month;;
				day = day > 9 ? day : '0' + day;
				return `${year}-${month}-${day}`;
			}
		},
	}
	function sleep2(ms) {
		return new Promise(function(resolve, reject) {
			setTimeout(resolve, ms)
		})
	}
</script>

<style>
	
	page {
		background: rgb(255, 255, 255);
	}

	.hetong-box {
		background: #f5f5f5;
		padding-top: 20upx;

	}

	.hetong {
		background: rgb(255, 255, 255);
		padding: 0 30upx;
	}

	.title {
		text-align: center;
		line-height: 100upx;
		font-size: 17px;
	}

	.row {
		height: 98upx;
		border-bottom: 1px solid rgba(0, 0, 0, 0.1);
		display: flex;
		flex-direction: row;
		align-items: center;
	}

	.left {
		font-size: 15px;
		padding-right: 20px;
		flex: 1;
	}
	.row input{
		flex: 3;
	}
	.questionBox {
		display: flex;
		flex-direction: row;
		justify-content: center;
		width: 100%;
		padding: 40upx 0;
		text-align: center;
		

	}

	.question {
		width: 240upx;
		height: 70upx;
		background: linear-gradient(-90deg, rgba(196, 156, 90, 1) 0%, rgba(226, 196, 138, 1) 100%);
		border-radius: 35px;
		display: flex;
		flex-direction: row;
		align-items: center;
		justify-content: center;
		color: rgb(255, 255, 255);

	}
	label {
		margin-right: 10upx;
	}
	.shuoming {
		width: 650upx;
		padding:20upx 18upx;
		color: rgba(153, 153, 153, 1);
		font-size: 14px;
		height: 100upx;
		border:1px solid rgba(238,238,238,1);
		border-radius:5px;
		margin-top: 20upx;
	}
	.right{
		min-width: 520upx;
	}
	.chooseInp {
		flex: 3;
	}
</style>
